<!-- 每日报表 -->

<script setup lang="tsx">
import { ref, inject ,onMounted} from 'vue';
import MyTable from '@/components/myTable/index.vue';
import QueryBox from '@/components/queryBox/index.vue';
import { SearchIcon } from 'tdesign-icons-vue-next';
import { MessagePlugin } from 'tdesign-vue-next';
// import { getList } from '@/api/member/proxyStatistics';

import { search } from '@/api/statistics/dailyReports/dailyReports';

const addDateRange = inject<typeof addDateRange>('addDateRange');
const data = ref([]);
onMounted(() => {
  onReset();
});
const columns = [
  {
    title: '日期',
    colKey: 'recordDate',
  },
  {
    title: '新增VIP人数',
    colKey: 'purchaseMemberCount',
  },
  {
    title: '充值',
    colKey: 'rechargeAmount',
  },
  {
    title: '提现',
    colKey: 'withdrawAmount',
  },
  {
    title: '下级任务返点',
    colKey: 'subordinateTaskPoints',
  },
  {
    title: '活动',
    colKey: 'otherAmount',
  },
  {
    title: '购买会员',
    colKey: 'purchaseMember',
  },
  {
    title: '推广奖励',
    colKey: 'promotionReward',
  },
  {
    title: '任务佣金',
    colKey: 'taskCommission',
  },
  {
    title: '其他',
    colKey: 'otherAmount',
  },
];

const pagination = ref({
  defaultCurrent: 1,
  defaultPageSize: 10,
  total: 0,
});

interface FormDataType {
  username: string | null;
  pageNum: string | number | null;
  pageSize: string | number | null;
}
const INITIAL_QUERYFORM: FormDataType = {
  username: undefined,
  pageNum: null,
  pageSize: null,
};
const queryForm = ref({ ...INITIAL_QUERYFORM });

const dateRange = ref<string[]>([]);
// const balanceRange = ref<[number | null, number | null]>([null, null]);
const onPaginationChange = ({ current, pageSize }) => {
  pagination.value.defaultCurrent = current;
  pagination.value.defaultPageSize = pageSize;
  unGetList();
};



const onReset = () => {
  queryForm.value = { ...INITIAL_QUERYFORM };
  dateRange.value = [];
  pagination.value.defaultCurrent = 1;
  unGetList();
};

const render = () => (
  <>
    <QueryBox onReset={onReset} v-model:defaultCurrent={pagination.value.defaultCurrent} onSearch={unGetList}>
      <t-input v-model={queryForm.value.username} placeholder="账号" style="width: 240px;">
        {{
          prefixIcon: () => <SearchIcon />,
        }}
      </t-input>
      <t-date-range-picker v-model={dateRange.value} placeholder="日期" />
    </QueryBox>
  <MyTable
      columns={columns}
      data={data.value}
      v-model:pagination={pagination.value}
      rowKey="recordDate"
      onUnGetList={unGetList}
      pagination={pagination.value}
    ></MyTable>
  </>
);

const unGetList = async () => {
  console.log('分页参数', pagination.value.defaultCurrent, pagination.value.defaultPageSize);

  try {
    const params: any = {
      pageNum: pagination.value.defaultCurrent,
      pageSize: pagination.value.defaultPageSize,
      beginTime: dateRange.value[0] || undefined,
      endTime: dateRange.value[1] || undefined,
      // 其它参数可按需添加
    };

    console.log('dateRange', dateRange.value);
    const res = await search(params);
    data.value = res.rows;
    pagination.value = {
      ...pagination.value,
      total: res.total,
    };
  } catch (e) {
    console.log(e);
  }
};
</script>

<!-- <template>
  <div>
    <render />
    <table>
      <tr v-for="row in data" :key="row['recordDate']">
        <td v-for="col in columns" :key="col.colKey">
          {{ row[col.colKey] }}
        </td>
      </tr>
    </table>
  </div>
</template> -->
<template>
  <div>
    <render />
  </div>
</template>
